<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no minimal-ui">
    <title></title>
    <link rel="stylesheet" href="/public/api/we_chat/css/css.css"/>
    <script src="/public/api/we_chat/js/jquery-2.1.0.js"></script>
    <style>
        .two{
            display: none;
        }
    </style>
    <script src="/public/layer/layer.js?{$stamp}"></script>
</head>
<body style="background: #FAFAFA">

<div class="head one" style="background: #fff;margin-top: 3%;border: 0">
    <!-- 状态1-->

    <!-- 状态2-->
    <div class="type2" >
        <span>Honey ID:</span>
        <input name="id" type="text" class="ips" placeholder="请输入您的账户ID"/>
    </div>
</div>
<a  class="sub one" id="next">下一步</a>


<div class="top two">
    <p>确认充值的账号，充值后不可退款或更改</p>
</div>
<div class="head two" >
    <!-- 状态1-->
    <div class="type1">
        <img id="header_img" src="/public/api/we_chat/img/default.41cff8a.jpg" alt=""/>
        <div class="con">
            <span id="nick_name"></span>
            <p>ID: <span id="uuid">123456</span></p>
        </div>
        <a id="qi" class="qi">切换账号</a>
    </div>
    <!-- 状态2-->
    <div class="type2 hide">
        <input type="text" placeholder="请输入您的用户ID"/>
    </div>
</div>
<div class="list two">

    {volist name="config" id="vo"}
    <div class="li">
        <img src="/public/api/we_chat/img/dem.png" alt=""/>
        <p>{$vo.money}</p>
        <a  class="qi confirm" data-id="{$vo.r_id}">￥{$vo.price}</a>
    </div>
    {/volist}

</div>
<div class="bottom">
    联系客服 {$phone}
</div>

<input type="hidden" name="open_id" value="{$open_id}">
<input type="hidden" name="user_id" value="">

<script>

    function callpay(params)
    {
        if (typeof WeixinJSBridge == "undefined"){
            if( document.addEventListener ){
                document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
            }else if (document.attachEvent){
                document.attachEvent('WeixinJSBridgeReady', jsApiCall);
                document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
            }
        }else{
            jsApiCall(params);
        }
    }


    function jsApiCall(params)
    {
        WeixinJSBridge.invoke(
            'getBrandWCPayRequest',
            params,
        function(res){
            WeixinJSBridge.log(res.err_msg);
            alert(res.err_code+res.err_desc+res.err_msg);
        }
    );
    }


    $('.confirm').click(function () {

        layer.load(1, {
            shade: [0.3,'#999999'] //0.1透明度的白色背景
        });
        var open_id = $("input[name='open_id']").val();
        var formData = new FormData();
        var id = $(this).data('id');
        var user_id = $("input[name='user_id']").val();
        formData.append('id',id);
        formData.append('open_id',open_id);
        formData.append('user_id',user_id);

        var uri = "{:url('getSign')}";
        $.ajax({
            type: "POST",
            url: uri,
            dataType: "json",
            data:formData,
            async: false,//使用同步的方式,true为异步方式
            processData: false,   // jQuery不要去处理发送的数据
            contentType: false,   // jQuery不要去设置Content-Type请求头
            success: function (data) {

                if (data.code == 1){

                    callpay(data.data);
                }else{
                    layer.alert(data.msg);
                }

            },
            error:function (e) {
                console.log(e);
                layer.alert('服务器繁忙,请稍后重试');
            }
        });
        layer.closeAll("loading");

    });


    $("#qi").click(function () {
        $(".one").show();
        $(".two").hide();
    });

    $("#next").click(function(){
        var id = $("input[name='id']").val();

        if (id == ''){
            layer.alert('请输入要充值的账号!');
            return false;
        }
        var reg = /^[0-9]*$/;

        if (!reg.test(id)) {
            layer.alert("请输入正确的账号");
            return false;
        }
        var uri = "{:url('info')}";
        var formData = new FormData();
        formData.append('id',id);
        $.ajax({
            type: "POST",
            url: uri,
            dataType: "json",
            data:formData,
            async: false,//使用同步的方式,true为异步方式
            processData: false,   // jQuery不要去处理发送的数据
            contentType: false,   // jQuery不要去设置Content-Type请求头
            success: function (data) {

                if (data.code == 1){

                    $("#header_img").attr('src',data.data.header_img);
                    $("#uuid").html(data.data.uuid);
                    $("#nick_name").html(data.data.nick_name);
                    $("input[name='user_id']").val(data.data.user_id);

                    $(".one").hide();
                    $(".two").show();
                }else{
                    layer.alert(data.msg);
                }

            },
            error:function (e) {
                layer.alert('服务器繁忙,请稍后重试');

            }
        })


    });

</script>
</body>
</html>